<template>
  <ydh-ball :class="class" v-for="i in balls" :num="i" :type="type"></ydh-ball>
</template>
<script setup lang="ts">
import ydhBall from "../ball/ydh-ball.vue";
defineProps({
  class: {
    type: String,
    default: ""
  },
  type: {
    type: String,
    default: "default"
  }
});
const balls = ref([0, 1, 2, 3, 4]);
function getRandomNumbers() {
  const numbers = Array.from({ length: 10 }, (_, i) => i); // 创建包含 0 到 9 的数组
  const result = [];

  for (let i = 0; i < 5; i++) {
    // 循环 5 次
    const randomIndex = Math.floor(Math.random() * numbers.length);
    result.push(numbers.splice(randomIndex, 1)[0]); // 从数组中取出一个随机数并添加到结果中
  }

  return result;
}
let timer: any = null;
onMounted(() => {
  timer = setInterval(() => {
    balls.value = getRandomNumbers();
  }, 300);
});
onUnmounted(() => {
  clearInterval(timer);
});
</script>
